<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <div>
        <button onclick="set">set()</button>
    </div>
    <div id="app">

    </div>
    <script>
        let obj = {
            user: "henq",
            live: ["台球", "自行车", "旅行"],
            list: [{ name: "汽车", id: 1 }, { name: "卡尺", id: 2 }, { name: "吉祥", id: 3 }],
        }
        const handler={
            get: (target, property, reciver) => {
                console.warn("get",property);
                return Reflect.get(target,property,reciver)
            },
            set: (target, property, value, reciver) => {
                console.warn("set",property,value);
                 Reflect.set(target,property,value,reciver)
            },
        }
        const state = new Proxy(obj, handler);
        let users=[{ name: "汽车", id: 1 }, { name: "卡尺", id: 2 }, { name: "吉祥", id: 3 }];
        const stateUsers=new Proxy(users,handler);
       const set=()=>{
        console.warn("",obj)
       }
       const get=(key)=>{
         let k=key.split('.');
         return eval('obj["live"][0]')
       }
    </script>
    
</body>

</html>